<template>

  <a-card :bordered="false" class="widget-1">
    <div class="ant-statistic-title">搜索</div>

    <a-row>

      <a-col :span="24" :lg="12" :xl="5" class="mb-24" >
        发布时间: <a-range-picker  @change="onChange" />
      </a-col>

      <a-col :span="24" :lg="12" :xl="5" class="mb-24" >
        标签:
        <a-select mode="tags" style="width: 100%" placeholder="Tags Mode" @change="handleChange">
          <a-select-option v-for="i in LabelS" :key="i.labelId+''">
            {{i.name}}
          </a-select-option>
      </a-select>

      </a-col>

      <a-col :span="24" :lg="12" :xl="4" class="mb-24" >
        类别:
        <a-select
            ref="select"
            v-model:value="typeValue"
            style="width: 100%"

            @change="typeHandleChange"

        >
          <a-select-option value="">全部</a-select-option>
          <a-select-option value="招领">招领</a-select-option>
          <a-select-option value="寻物">寻物</a-select-option>
        </a-select>

      </a-col>


      <a-col :span="24" :lg="12" :xl="5" class="mb-24" >
        发布者标题:
        <a-input @change="titleChange" v-model="titleString" placeholder="请输入发布者标题" />
      </a-col>

      <a-col :span="24" :lg="12" :xl="5" class="mb-24" >
        发布者内容:
        <a-input @change="textChange" v-model="textString" placeholder="请输入发布者内容" />
      </a-col>

<!--      <a-col :span="24" :lg="12" :xl="5" class="mb-24" >-->
<!--        回复者内容:-->
<!--        <a-input placeholder="请输入回复者内容" />-->
<!--      </a-col>-->

    </a-row>

    <a-button @click="searchButton" class="icon" type="primary" shape="circle" icon="search" />




  </a-card>

</template>

<script>

export default ({
  props: {
    searchItem: {
      type: Object,
      default: function (){
        return {}
      },
    },
  },
  beforeCreate() {

    this.$http({
      method: 'post',
      url: 'http://localhost:18082/label/getall',
      data: {},

    }).then((e)=>{

      this.LabelS=e.data.data;
      console.log("查看当前事项",e);

    })

  },
  data() {
    return {
      LabelS:[],
      titleString:'',
      textString:'',
      tagS:[],
      dateS:[],
      typeValue:""
    }
  },
  methods:{
    searchButton(){
      this.$emit('searchChange')
    },
    searchChange(){
      this.$emit('valueChange',{
        dateS:this.dateS,
        tagS:this.tagS,
        title:this.titleString,
        text:this.textString,
        typeValue:this.typeValue,
      })
    },
    NullChange(e){

    },
    onChange(e){
      console.log("查看时间数据",e);
      this.dateS=e;
      this.searchChange()
    },
    handleChange(e){
      console.log("查看标签数据",e);
      this.tagS=e;
      this.searchChange()
    },
    typeHandleChange(e){
      console.log("查看标签数据",e);
      this.typeValue=e;
      this.searchChange()
    },
    titleChange(e){
      console.log("查看标题数据",this.titleString);
      this.searchChange()
    },
    textChange(e){
      console.log("查看内容数据",this.textString);
      this.searchChange()
    }
  }
})

</script>